{layout name="layout2" /}
<script src="__PUBLIC__/static/common/js/area.js"></script>
<div class="layui-form" lay-filter="layuiadmin-form-unit" id="layuiadmin-form-unit" style="padding: 20px 30px 0 0;">
    <div class="layui-form-item">
        <label class="layui-form-label" style="white-space: nowrap;"><font color="red">*</font>基地角色名称：</label>
        <div class="layui-input-inline" style="width: 400px">
            <input type="text" name="staffingName" lay-verify="required" lay-vertype="tips" placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
      <!-- <div class="layui-form-item">
        <label class="layui-form-label" style="white-space: nowrap;"><font color="red">*</font>基地简介：</label>
        <div class="layui-input-inline" style="width: 400px">
            <input type="text" name="remark" lay-verify="required" lay-vertype="tips" placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
      <div class="layui-form-item">
        <label class="layui-form-label" style="white-space: nowrap;"><font color="red">*</font>基地地址：</label>
        <div class="layui-input-inline" style="width: 400px">
            <input type="text" name="address" lay-verify="required" lay-vertype="tips" placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
  <div class="layui-form-item" style="margin-bottom: 0px">
                        <label class="layui-form-label"><span class="form-label-asterisk">*</span>基地图片：</label>
                        <div style="height:80px;line-height:80px">
                            <div class="master-image" ></div>
                            <div class="goods-img-add goods-image" lay-verify="img" lay-verType="tips" switch-tab="0" verify-msg="选择图片"></div>
                        </div>
                    </div> -->
                    

    <!-- <div class="layui-form-item">
        <label class="layui-form-label">初始状态：</label>
        <div class="layui-input-block">
            <input type="radio"  name="status" title="正常" value="0" lay-filter="link">
            <input type="radio" name="status" title="隐藏" value="1" lay-filter="link">
        </div>
    </div> -->


    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="Base-Staffing-submit" id="Base-Staffing-submit" value="确认">
    </div>
</div>
<script>
    layui.config({
        version:"{$front_version}",
        base: '/static/plug/layui-admin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form','like','likeedit'], function(){
        var $ = layui.$;
var like = layui.like;
var form = layui.form;
var likeedit = layui.likeedit;
           like.imageUpload('.goods-img-add', function (uris, element) {
            if(element.hasClass('goods-image')){
                if(uris.length>1){
                    layer.msg('最多最能选中1张图片');
                    return;
                }
                var html = '' +
                    '<input name="img" type="hidden" value="'+ '/' + uris[0] + '">' +
                    '  <img class="goods-img" src="' + '/' + uris[0] + '">\n' +
                    '<a class="goods-img-del-x goods-image-del">x</a>'
                element.prev().append(html);
                element.css('display','none');;
                return 0;
            }

            var count = element.prev().children().length;

            count = !count ? 0:count;
            if (count+uris.length > 8) {
                layer.msg('最多最能选中8张图片');
                return;
            }
            uris = uris.reverse();
            for(var i in uris){
                var uri = uris[i];
                var template_goods_image = $('#template-goods-image').html();
                element.prev().append(template_goods_image.replace('{image-src}', '/'+uri).replace('{image-src}', '/'+uri));
            }
        }, true);

        //图片拉拽
        $(document).on('dragstart', '.goods-li', function (e) {
            dragstart = e.offsetX;
        });
        $(document).on('dragend', '.goods-li', function (e) {
            swop_element_ed = -1;
        });
        $(document).on('mousedown', '.goods-li', function (e) {
            swop_element_ed = -1;
        });
        $(document).on('dragover', '.goods-li', function (e) {
            e.preventDefault();
            swop_element = parseInt((e.clientX - dragstart) / 100) - 1;
            swop_element = swop_element <= 0 ? 0 : swop_element;
            my_element = $(this).prevAll().length;
            if (swop_element == my_element) {
                return;
            }
            if (swop_element == swop_element_ed) {
                return;
            }
            swop_element_ed = swop_element;
            swop($(this), $(this).parent().children().eq(swop_element));
        });


    })


</script>